“iNews” Documentation by “SBTemplates” v1.0

iNews Professional

Created: 01 Jan 2014
By: Aumkar Thakur
Email: aumkarakhilesh@gmail.com

Thank you for downloading my theme. If you have any questions that are beyond the scope of this help file, please feel free to email via my user page contact form here. Thanks so much!

Getting Started - top

Hello, Lets start with installation process for these you need a account on blogger.com where you can create a free blog, In this guide I'm not going to tell you that how you can create a blog on blogger, I assume that you have a blogger account with a blogger blog, so let's get started!

Installing Blogger Template

Follow Below Steps To Install Blogger Template -

On Blogger Dashboard Click Template

Now Click On Backup/Restore button (Top Right).

Click Choose File button. Find where the “iNews-theme.xml” file location.

Now Click On Upload Button.

Customizing Menu - top

To customize the drop down menu located above header follow below steps-

On Blogger Dashboard Click Template

Now Click On Edit HTML button

Now using ctrl+f find below code


<ul class="menunav l_tinynav1">

<li class="firstli"><a href="/">Home</a></li>

<li><a href="your-link-here">About</a></li>

<li>

<a href="your-link-here">  Portfolio</a>

<ul>

<li><a href="your-link-here">Web Design</a></li>

<li><a href="your-link-here">Development</a></li>

<li><a href="your-link-here">Illustrations</a></li>

</ul>

</li>

<li><a href="your-link-here">404</a></li>

<li><a href="your-link-here">Contact</a></li>

<li><a href="your-link-here">Themes</a></li>

</ul>

Now replace your-link-here and all blue color text.

Customize Social Buttons - top

Social Media Follow Us buttons will help your blog/website to make your blog viral on Social Medias, To change the link of social medias button follow below steps:

Go to blogger dashboard

Click On Template Tab

Now Click On Edit HTML button

Now using ctrl+f find below code

<div class='boxingofscl'>

<div class='scl-btn-sid'>
<a href='http://www.facebook.com/seobloggertemplates' target='_blank'><img border='0' src='http://1.bp.blogspot.com/-H38kJ5PSU-k/Uin2qt9WW0I/AAAAAAAAAP8/W5Wmpt42xwY/s1600/facebook.png'/></a>
</div>
<div class='scl-btn-sid'>
<a href='http://www.twitter.com/bloglordhtml' target='_blank'><img border='0' src='http://2.bp.blogspot.com/-B3UXsAyQbdw/Uin2scG5PKI/AAAAAAAAAQU/zcSj3UljGCw/s1600/twitter.png'/></a>
</div>
<div class='scl-btn-sid'>
<a href='http://www.plus.google.com/username' target='_blank'><img border='0' src='http://3.bp.blogspot.com/--Pp4ZjOu4Ew/Uin2qgGT5zI/AAAAAAAAAP4/sMX3HGgzctE/s1600/google+.png'/></a>
</div>
<div class='scl-btn-sid'>
<a href='http://www.youtube.com/username' target='_blank'><img border='0' src='http://3.bp.blogspot.com/-2KJ18EdFkdM/Uin2sS-cP1I/AAAAAAAAAQQ/7Vv8-WQWRQo/s1600/youtube.png'/></a>
</div>
<div class='scl-btn-sid'>
<a href='http://www.feedburner.com/username' target='_blank'><img border='0' src='http://2.bp.blogspot.com/-aVX-dCRSr-A/Uin2qzynvOI/AAAAAAAAAQI/l-Mn8lg6sPs/s1600/rss.png'/></a>
</div>
</div>

Now replace all red color highlited url with your scoial medias username.

Add Your Feedburner username - top

Email Subscription box will help you to make your blog viral using email marketing, to add your own feedburner user name follow below steps:

Go to blogger dashboard

Now click on Template tab

Now Click on Edit HTML button and find below code


<form action='http://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=seotemplates&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'><p class='etlt'>Subscribe Via Email</p><p><input class='einputb' name='email' placeholder='Your Email Here...' type='text'/></p><input name='uri' type='hidden' value='seotemplates'/><input name='loc' type='hidden' value='en_US'/><input class='ebtn' type='submit' value='Subscribe'/></form>

Now replace seotemplates with your feedburner username.

Add You Own Facebook Apps ID - top

Step#1

The First thing you need to do is to create a separate App ID for your application and that can be done easily through Facebook Developer. Login to your Facebook account and go to Facebook Developers website. This places allow Developers to manage their apps hosted at Facebook, click on Create New App button.

A Small pop out will appear which would ask you to insert little information about your application. There are two fields, write the App name and press the continue button.

Now you will land of a new page which would provide you your application details like App ID, App name and etc. You need to copy these keys and enter them later.

Step#2

On Blogger Dashboard Click Template

Now Click On Edit HTML button

Now using ctrl+f find below code

<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR_APP_ID',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};

Now Replace YOUR_APP_ID with the app id which you have obtained in step#1.

Now finally you can save your template.

Add Your Own Disqus Shortname - top

Adding your own shorname to discus wil give you the admin position by which you can manage all disqus comments on your blog.

On Blogger Dashboard Click Template

Now Click On Edit HTML button

Now using ctrl+f find below code

var disqus_shortname = 'testthemeforest'

Now replace testthemeforest with your own disqus shortname.

Where you can get Disqus shortname?

Access your Disqus Admin and choose Settings

Then scroll down to Site Identify, you will see the shortname there.

How to show post with labels - top

At last I'm going to tell you the most important thing which you have to add in your blog, Follow all the below steps carefully:

Go to blogger dashboard

Click on Layout tab

Now add a new gadget >> Html/JavaScript.

Paste below code there


<div id='featurebottom1'>

<h2 class='headingfeature'>

technology <a class="linku" href="/search/label/technology">Load More</a>

</h2>

<div class='left-corner-canvas'/>

<script src='/feeds/posts/summary/-/technology?

max-results=3&amp;orderby=published&amp;alt=json-in-script&amp;

callback=recentthumbs&amp;' type='text/javascript'/>

</div>

<div style='clear:both;'/>

</script>

</div>

</div>

Now Replace technology with any label from which you want to display posts.

Click On Save button

Now you might be guessing that what that blue color highlited code will do, There are three style of showing post with label Replace recentthumbs with any of the below style.

Style 1

This is by default style, you don't have to do any change in code to show this style, simply paste above code and save.

Style 2

To add this style replace recentthumbs with recentthumbs2

Style 2

To add this style replace recentthumbs with recentthumbs3

“iNews” Documentation by “SBTemplates” v1.0

iNews Professional

Table of Content

Getting Started - top

Installing Blogger Template

Customizing Menu - top

Customize Social Buttons - top

Add Your Feedburner username - top

Add You Own Facebook Apps ID - top

Step#1

Step#2

Add Your Own Disqus Shortname - top

Where you can get Disqus shortname?

How to show post with labels - top

Style 1

Style 2

Style 2

The End